<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>主页</title>
</head>
<body>
<div style="margin: 0 auto; width: 800px;">
    <h1 style="text-align: center">欢迎来到xxx管理系统</h1>
    <hr>
    <!-- 设计表格,展现用户信息 -->
    <table style="width: 100%;" border="2">
        <tr>
            <th>编号</th>
            <th>用户名</th>
            <th>密码</th>
            <th>手机</th>
            <th>注册时间</th>
            <th>账户余额</th>
            <th>性别</th>
            <th>操作</th>

        </tr>
    </table>
</div>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
    // 页面加载完成后,执行
    $(document).ready(function () {
        // 异步请求用户信息
        $.ajax({
            url: "/day30_tomcat_serlet_war/userlist",
            type: "GET",
            dataType: "json",
            success: function (data) { // 后端返回数据
                console.log(data)
                // 遍历用户信息,并填充到表格中
                 let arr=data.users

                console.log("arr:" + arr)
                console.log("data.users:" + data.users[0])

                $.each(data.users, function (index, item) {
                    var tr = $("<tr></tr>");
                    tr.append("<td>" + item.id + "</td>");
                    tr.append("<td>" + item.username + "</td>");
                    tr.append("<td>" + item.password + "</td>");
                    tr.append("<td>" + item.phone + "</td>");
                    tr.append("<td>" + item.createTime + "</td>");
                    tr.append("<td>" + item.money + "</td>");
                    tr.append("<td>" + item.sex == 1 ? "男" : "女" + "</td>");
                    tr.append("<td> <a href='javascript:void(0)' onclick='del(" + item.id + ")'>删除</a></td>");
                    $("table").append(tr);
                }); // end each function
            },   // end success function
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert("获取用户信息失败");
            }
        });
    });

    // 删除用户信息
    function del(id) {
        if (confirm("确认删除该用户信息吗?")) {    // 弹出确认框
            $.ajax({
                url: "/day30_tomcat_serlet_war/user/delect?id=" + id,
                type: "get",
                dataType: "json",
                success: function (data) {
                    console.log(data)
                    alert("删除成功",data);
                    // 刷新页面
                    window.location.href = "admin.html";
                },   // end success function
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert("删除失败");
                }
            });
        }
    }

</script>

</body>
</html>
